<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>firstVue</title>
    <!-- //引入Vue -->
   <script type='text/javascript' src='../vue.js'></script>
</head>
<body>
   <div id="root">
      <h1>差值语法</h1>
      <h3>你好 {{name}}</h3>
     
      <hr>
    
      <h1>指令语法</h1>
      <a :href=company.bilibili>点我去{{company.bilibiliName}}</a>
      <a v-bind:href=company.baidu>点我去{{company.baiduName}}</a>
   </div>

   <script type='text/javascript'>
      Vue.config.productionTip = false
      const vm = new Vue({
         el:'#root',
         data:{
            name:'jack',
             bilibili:'https://bilibili.com',
             baidu:'https://www.baidu.com',
             bilibiliName:'bilibili',
             baiduName:'baidu',
            company: {
                bilibili:'https://bilibili.com',
                baidu:'https://www.baidu.com',
                bilibiliName:'哔哩哔哩',
                baiduName:'百度'
            }
            
         }
        
      })
   </script>
   
</body>
</html>